import { Button } from "@/components/ui"
import { useNavigate } from "react-router"
import { usePriceStore } from '@/store'
import { useImmer } from '@/hooks/useImmer'

export const Home = () => {

    const router = useNavigate()
    const priceStore = usePriceStore()
    const { reduce } = useImmer()

    const data = {
        name: '张三',
        age: 18
    }

    const newObj = reduce(data, (draft) => {
        draft.name = '李四'
        draft.age = 20

    })

    console.log(data, newObj);


    return <>
        <Button onClick={() => router('/about', {
        })}>去往About</Button>

        <div>金额：{priceStore.getPrice()}</div>
        <div>state: {priceStore.getState()}</div>
        <div>
            <Button onClick={() => priceStore.incrementPrice()}>金额 + 1</Button>
            <Button onClick={() => priceStore.decrementPrice()}>金额 - 1</Button>
            <Button onClick={() => priceStore.resetPrice()}>金额重置</Button>
        </div>
    </>
}